<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/jsp/common/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<link rel="stylesheet" href="${ctx}/res/js/thirdParty/zTree_v3/css/zTreeStyle/zTreeStyle.css" type="text/css">
	<script type="text/javascript" src="${ctx}/res/js/thirdParty/zTree_v3/js/jquery.ztree.core-3.5.js"></script>
	<script type="text/javascript" src="${ctx}/res/js/departmentManagement/departmentList.js"></script>
	<style type="text/css">
		.divToolbar {
			line-height: 30px;
			text-align: left;
			width: 300px;
			margin-top: 30px;
			margin-bottom: 5px;
		}
		
		.treeScroll {
			width: 300px;
			height:400px;
			overflow: auto;
		}
		
		.divButton {
			margin: 0 2px 0 2px;
			padding: 1px 1px 1px 1px;
			min-width: 65px;
		}
		
		.chooseGroup {
			line-height: 25px;
			margin-bottom: 2px;
			cursor: pointer;
			font-size: 17px;
			background-color: #2daeda;
			line-height: 30px;
			padding-left: 5px;
		}
	</style>

</head>
<body>
	<table>
		<tr>
			<td style="vertical-align: top;">				 
					<div class="list_toolbar divToolbar">
						<div class="toolButton divButton" id="showAddDiv">新建</div>
						<div class="toolButton divButton" id="showUpdateDiv">修改</div>
						<div class="toolButton divButton" id="deleteDepartment">删除</div>
					</div>
					
					<div class="zTreeDemoBackground left treeScroll">
						<ul id="departmentTree" class="ztree"></ul>
					</div>
			</td>
			
			<td style="vertical-align: top;">
				<table id="userListTable">
					<!-- 按钮操作区域 -->
					<tr style="height:30px;">
						<td>
							<div class="list_toolbar" id="operateUserDiv">
								<div class="toolButton" id="addUsers">增加</div>
								<div class="toolButton" id="deleteUsers">删除</div>
							</div>
						</td>
					</tr>
					<tr>
						<td>
							<table class="list_grid">
								<thead>
									<tr>
										<th>USERNAME</th>
										<th>CN_NAME</th>
										<th>DEPT_NAME</th>
										<th style="width: 1px;"></th>
									</tr>
								</thead>
							</table>
						</td>
					</tr>

					<tr>
						<td>
							<div class="list_scrollControlDiv" style="height: 342px;">
								<table class="list_grid" style="border-spacing: 0;">
									<tbody id="tBodyList" class="userItem">	
										<tr><td style="text-align:center;">&nbsp;</td></tr>									 
									</tbody>
								</table>
							</div>
						</td>
					</tr>

					<!-- 分页控件区域 -->
					<tr>
						<td>
							<div id="pagination" class="pagination"></div>
						</td>
					</tr>
				</table>
				
				<div id="groupInfoDiv" class="form_data" style="width: 993px;display:none;">
					<form id="departmentForm" style="padding-top:14%;">		 
						<center><table>
							<tbody><tr>
								<td class="td_for_label">DEPT_NAME<span style="color:red">*</span> </td>
								<td class="td_for_input">
									<input type="text" id="deptName" placeholder="请输入DEPT_NAME"  name="deptName" required value="">
								</td>
							</tr>
							
							<tr>
								<td class="td_for_label">DEPT_DESC</td>
								<td class="td_for_input">
									<input type="text" id="deptDesc" placeholder="请输入DEPT_DESC" name="deptDesc" value="">
								</td>
							</tr>
							<tr>
								<td style="text-align:center;padding:10px;" colspan="2">
									<div id="btnSubmit" class="toolButton">确定</div>
									<div id="btnCancel" class="toolButton">取消</div>
								</td>
							</tr>
						</tbody></table>
						</center>
					</form>
				</div>
			</td>
		</tr>
	</table>
</body>
</html>